<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition template="/template.xhtml"
                xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:c="http://java.sun.com/jsp/jstl/core">
    <ui:define  name="body">
        <script type="text/javascript">
            function handleDrop(event, ui) {
                var draggable = ui.draggable,
                helper = ui.helper,
                position = ui.position,
                offset = ui.offset;
            }
            function handleComplete(xhr, status, args) {
                {

                    if(!args.validationFailed || args.saved)
                    {
                        ass_dlg.hide();
                    }
                    else
                    {
                        jQuery(ass_dlg).effect("shake", { times:3 }, 100);
                    }
                }
            }
            function doClear(theText) {
                theText.value = ""
            }

            function hideDiv(component) {
                jQuery(component).parent().fadeOut(500);
            }
            function showDiv() {
                if (document.getElementById) {
                    document.getElementById('div').style.visibility = 'visible';
                }
            }
            var myWindow;

            function openCenteredWindow(url) {
                var width = 800;
                var height = 500;
                var left = parseInt((screen.availWidth/2) - (width/2));
                var top = parseInt((screen.availHeight/2) - (height/2));
                var windowFeatures = "width=" + width + ",height=" + height + ",status,resizable,scrollbars=yes,left=" + left + ",top=" + top + "screenX=" + left + ",screenY=" + top;
                myWindow = window.open(url, "subWind", windowFeatures);
            }
        </script>
        <p:dialog id="dlg" widgetVar="ass_dlg" header="New Assembly"  modal="true" appendToBody="true" width="500">
            <h:form id="dalog" styleClass="form" transient="true" >
                <h:outputLabel value="Description:"  styleClass="label" />
                <p:inputText id="asbDesc" value="#{projectController.current.prjDesc}" autocomplete="false" onfocus="doClear(this);"  title="#{bundle.CreateProjectTitle_asbDesc}" required="true" />
                <p:spacer width="10"/>
                <p:commandButton   actionListener="#{projectController.create()}" value="#{bundle.CreateProjectSaveLink}"  process="@form"   update=":userForm:" oncomplete="handleComplete(xhr, status, args)"/>
            </h:form>
        </p:dialog>
        <h:form id="userForm"   >
            <p:fieldset legend="Project Viewer" id="user_create" styleClass="form" >
                <div class="icon_left">
                    <h:commandLink  action="/project/List" styleClass="menu_item" >
                        <h:graphicImage  value="../resources/images/syscon/proj.png"   />
                        <br/>
                        <h:outputText  value="Projects"/>
                    </h:commandLink>
                </div>
                <h:outputText value="#{projectController.current.prjName}" styleClass="engraved"/>
                <br/>
                <h:outputText value="Project ID:" styleClass="label"/>
                <h:outputText value="#{projectController.current.prjId}" title="#{bundle.ViewProjectTitle_prjId}"/>
                <p:spacer width="10"/>
                <h:outputText value="Project Name:" styleClass="label"/>
                <h:outputText value="#{projectController.current.prjName}" title="#{bundle.ViewProjectTitle_prjName}"/>
                <p:spacer width="10"/>
                <h:outputText value="Project Description:" styleClass="label"/>
                <h:outputText value="#{projectController.current.prjDesc}" title="#{bundle.ViewProjectTitle_prjDesc}"/>
                <p:spacer width="10"/>
                <h:outputText value="Created in " styleClass="label"/>
                <h:outputText value="#{projectController.current.prjCreation}" />
                <p:spacer width="10"/>
                <h:outputText value="By User:" styleClass="label"/>
                <h:outputText value="#{projectController.current.createdBy.userLogin}" title="#{bundle.ViewProjectTitle_coordId}"/>
                <p:separator/>

                <c:if test="#{userController.allowedGroups('2') or userController.myselftEditing}">
                    <p:commandButton icon="ui-icon-pencil" ajax="false" action="#{projectController.prepareEdit}" value="Edit"/>
                    <p:spacer width="10"/>
                    <p:commandButton icon="ui-icon-plus" ajax="false" action="#{projectController.prepareCreate}" value="New" />
                    <p:spacer width="10"/>
                    <p:commandButton icon="ui-icon-list" ajax="false" action="#{projectController.prepareList}" value="Show All"/>
                    <p:spacer width="10"/>
                    <p:commandButton icon="ui-icon-close" ajax="false" action="#{projectController.destroy}" value="Delete"/>
                    <p:spacer width="10" />
                    <p:commandButton icon="ui-icon-show"  value="New Assembly" onclick="ass_dlg.show()"     />
                    <p:spacer width="10" />
                    <p:commandButton id="leave_btn" icon="ui-icon-show"  value="Leave Project" actionListener="#{projectController.leaveFromProject(userController.loggedUser)}" rendered="#{userController.assignedProjects.contains(projectController.current)}"   update="@form" />
                    <br/> <br/>
                    <p:commandButton onclick="openCenteredWindow('UpFile.bio');" value="Upload Files"/>
                </c:if>
                <br/>
                <br/>
                <p:panel id="staff" header="Current Staff - #{projectController.myUsers.size()} Members"   style="width:100%">
                    <c:if test="#{userController.allowedGroups('2,3')}">
                        <br/>
                        <p:fieldset  legend="Current GenBanks" rendered="#{not empty genBankController.items}" >
                            <p:dataTable id="gb_list"
                                         styleClass="data"
                                         var="gb"
                                         rowKey="#{gb}"
                                         value="#{genBankController.items}"
                                         selection="#{genBankController.current}"
                                         selectionMode="single"
                                         rows="8"
                                         paginator="#{genBankController.items.size() gt 8}"
                                         >
                                <p:column sortBy="#{gb.version}" filterBy="#{gb.version}" filterMatchMode="contains">
                                    <f:facet name="header">
                                        <h:outputText value="Version"/>
                                    </f:facet>
                                    <h:outputText value="#{gb.version}"/>
                                </p:column>
                                <p:column sortBy="#{gb.definition}" filterBy="#{gb.definition}" filterMatchMode="contains">
                                    <f:facet name="header">
                                        <h:outputText value="Definition"/>
                                    </f:facet>
                                    <h:outputText value="#{gb.definition}"/>
                                </p:column>
                                <p:column sortBy="#{gb.creationDate}" filterBy="#{gb.creationDate}" filterMatchMode="contains">
                                    <f:facet name="header">
                                        <h:outputText value="Creation"/>
                                    </f:facet>
                                    <h:outputText value="#{gb.creationDate}"/>
                                </p:column>
                            </p:dataTable>
                            <p:contextMenu for="gb_list" id="commands" >
                                <p:menuitem id="new_com" value="New" icon="ui-icon-plus" action="/genBank/Create?faces-redirect=true" actionListener="#{genBankController.prepareCreate()}"/>
                                <p:menuitem id="view_com" value="View" icon="ui-icon-search" action="/genBank/View?faces-redirect=true" actionListener="#{genBankController.prepareView()}">

                                </p:menuitem>
                                <p:menuitem id="des_com" value="Destroy" icon="ui-icon-close" update=":userForm:" actionListener="#{genBankController.destroy()}"/>
                            </p:contextMenu>
                            <p:blockUI block=":userForm:" trigger="des_com">
                                <h:outputText value="Please wait, data is being processed..." />  <br/>
                                <p:graphicImage value="/resources/ajaxloader.gif"/>
                            </p:blockUI>
                            <br/>
                        </p:fieldset>
                    </c:if>
                    <c:choose>
                        <c:when test="#{projectController.current.createdBy eq userController.loggedUser or userController.allowedGroups('1')}">
                            <p:fieldset  legend="Available Users" rendered="#{not empty projectController.candidateUsers}" >

                                <p:dataGrid id="availableUsers" var="user"  rendered="#{not empty projectController.candidateUsers}"
                                            value="#{projectController.candidateUsers}">
                                    <p:column styleClass="data">
                                        <center>
                                            <h:panelGrid id="user" columns="1" styleClass="center" >
                                                <p:graphicImage id="user_img" value="/resources/images/syscon/user_${user.userLive}.png" styleClass="button" >
                                                    <p:tooltip for="user_img" >
                                                        <h:outputText value="Drag me" >
                                                        </h:outputText>
                                                    </p:tooltip>
                                                </p:graphicImage>
                                                <p:commandLink id="user_link"  value="#{user.userLogin}"  action="/user/View?faces-redirect=true" styleClass="button" >
                                                    <f:setPropertyActionListener target="#{userController.current}" value="#{user}"/>
                                                </p:commandLink>
                                                <p:tooltip for="user_link" >
                                                    <h:outputText value="View User" >
                                                    </h:outputText>
                                                    <p:dataList  value="#{userController.groupsByUser(user)}" var="u" type="ordered" itemType="#"  rendered="#{not empty userController.groupsByUser(user)}">
                                                        <h:outputText value=" #{u.grDesc}"/>
                                                    </p:dataList>
                                                </p:tooltip>
                                            </h:panelGrid>
                                        </center>
                                        <p:draggable for="user" revert="true"
                                                     handle=".ui-panel #user" stack=".ui-panel" />
                                    </p:column>
                                </p:dataGrid>
                            </p:fieldset>
                            <!--  start message-yellow -->
                            <h:outputLabel rendered="#{(empty projectController.candidateUsers) and (empty projectController.myUsers)}">
                                <div class="message-yellow"  >
                                    <h:outputText styleClass="yellow-left" value="There is no users to be included in the project, please Create a " />
                                    <h:commandLink styleClass="yellow-left" action="/user/Create?faces-redirect=true" actionListener="#{userController.prepareCreate()}" value="User"/>
                                    <h:outputText styleClass="yellow-left" value=" First!" />
                                    <h:commandLink styleClass="yellow-right" onclick="hideDiv(this);return false"  />
                                </div>
                            </h:outputLabel>
                            <!--  end message-yellow -->
                            <p:fieldset id="selectedUsers" legend="Assigned Users" rendered="#{(not empty projectController.candidateUsers) or (not empty projectController.myUsers)}">
                                <p:outputPanel id="dropArea">
                                    <h:outputText   value="!!!Drop here!!!"
                                                    rendered="#{empty projectController.myUsers}"
                                                    style="font-size:24px;" />

                                    <p:dataGrid  id="myUsers" var="user" transient="true"
                                                 value="#{projectController.myUsers}"
                                                 rendered="#{not empty projectController.myUsers}"
                                                 >

                                        <p:column >
                                            <h:panelGrid id="user" columns="1"   styleClass="center">
                                                <p:graphicImage id="user_img" value="/resources/images/syscon/user_up_yellow.png">
                                                    <p:tooltip for="user_img">
                                                        <p:dataList  value="#{userController.groupsByUser(user)}" var="u" type="ordered" itemType="#"  rendered="#{not empty userController.groupsByUser(user)}">
                                                            <h:outputText value=" #{u.grDesc}"/>
                                                        </p:dataList>
                                                    </p:tooltip>
                                                </p:graphicImage>
                                                <p:commandLink id="user_link2" value="#{user.userLogin}"  action="/user/View?faces-redirect=true" styleClass="button" >
                                                    <f:setPropertyActionListener target="#{userController.current}" value="#{user}"/>
                                                </p:commandLink>
                                                <p:tooltip for="user_link2" >
                                                    <h:outputText value="View User" >
                                                    </h:outputText>
                                                </p:tooltip>
                                                <p:commandButton id="btn_remove" icon="ui-icon ui-icon-minusthick" title="Remove" actionListener="#{projectController.remUser(user)}" update=":userForm:">
                                                </p:commandButton>
                                            </h:panelGrid>
                                        </p:column>
                                        <p:blockUI block=":userForm:selectedUsers" trigger="btn_remove">
                                            <h:outputText value="Please wait, data is being processed..." />  <br/>
                                            <p:graphicImage value="/resources/ajaxloader.gif"/>
                                        </p:blockUI>
                                    </p:dataGrid>
                                </p:outputPanel>
                            </p:fieldset>
                            <p:droppable for="selectedUsers" tolerance="touch" activeStyleClass="ui-state-highlight" datasource="availableUsers" onDrop="handleDrop">
                                <p:ajax listener="#{projectController.onDrop}" update=":userForm:" />
                            </p:droppable>
                        </c:when>
                        <c:otherwise>

                        </c:otherwise>
                    </c:choose>


                </p:panel>

                <p:fieldset  id="files" legend="Project Files" styleClass="form"   rendered="#{userController.allowedGroups('2,3') and not empty projectController.files}">

                    <p:dataGrid id="filesPanel"
                                value="#{projectController.files}"
                                rendered="#{not empty projectController.files}"
                                var="file">
                        <p:column  >
                            <center >
                                <h:panelGrid  columns="1" styleClass="center">
                                    <p:graphicImage id="file" value="/resources/images/syscon/file_icon.png" styleClass="button">
                                        <p:tooltip for="file">
                                            <h:outputText value="File Size:"  styleClass="label"/>
                                            <h:outputText value=" #{file.fileSize / 1024} Kb"  />
                                            <br/>
                                            <h:outputText value="Uploaded in:"   styleClass="label"/>
                                            <h:outputText value=" #{file.fileDate}"  />
                                            <br/>
                                            <h:outputText value="Type:"   styleClass="label"/>
                                            <h:outputText value=" #{file.fileType}"  />
                                        </p:tooltip>
                                    </p:graphicImage>
                                    <p:commandLink id="viewLink"  value="#{file.title}" ajax="false" styleClass="button" >
                                        <p:fileDownload value="#{projectController.convertFile(file)}" contentDisposition="inline"  />
                                    </p:commandLink>
                                    <p:tooltip for="viewLink" >
                                        <h:outputText value="View File" >
                                        </h:outputText>
                                    </p:tooltip>
                                    <p:menu position="dynamic" trigger="file" my="left top" at="left bottom">
                                        <p:submenu label="GenBank" rendered="#{file.fileType eq 'GB File'}">
                                            <p:menuitem id="process_file" icon="ui-icon-disk" value="Filter File #{file.title}"   action="#{genBankParser.preProcessGB(file)}" process="@this"  >
                                            </p:menuitem>
                                        </p:submenu>
                                        <p:submenu label="File ">

                                            <p:menuitem id="downLink" icon="ui-icon-search" value="Download" ajax="false"  >
                                                <p:fileDownload value="#{projectController.convertFile(file)}"   />
                                            </p:menuitem>
                                            <p:menuitem id="rem" icon="ui-icon-close" value="Remove"  actionListener="#{projectController.remFile(file)}"  update=":userForm:" >
                                            </p:menuitem>
                                        </p:submenu>
                                    </p:menu>
                                </h:panelGrid>
                            </center>
                        </p:column>
                        <p:blockUI block=":userForm:files" trigger="rem,process_file">
                            <h:outputText value="Please wait, data is being processed..." />  <br/>
                            <p:graphicImage value="/resources/ajaxloader.gif"/>
                        </p:blockUI>
                    </p:dataGrid>
                </p:fieldset>
                <br/>
            </p:fieldset>
        </h:form>
    </ui:define>
</ui:composition>


